<!doctype html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <meta content="always" name="referrer">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <#include "../common/header.html">
</head>
<body>
<!--最外面的灰底框,用于与ifram区别开-->
<div class="col-xs-12 lightgray_div">
    <!--白底框-->
    <div class="col-xs-12 white_div">
        <!--搜索框-->
        <div class="col-xs-12 search_div">
            <div class="input-group g-fr">
                <form id="inquire" class="form-inline ">
                    <div class="input-group ">
                        <select class="form-control" name="role_id" id="role_id">
                        </select>
                    </div>
                    <div class="input-group ">
                        <input type="text" class="form-control" id="gmt_create" placeholder="注册时间">
                        <input type="hidden" id="gmt_create_start" name="gmt_create_start">
                        <input type="hidden" id="gmt_create_end" name="gmt_create_end">
                    </div>

                    <div class="input-group ">
                        <input type="text" class="form-control" name="account" placeholder="账号">
                    </div>
                    <button type="button" class="layui-btn" style="height: 30px" id="btn_search" onclick="table_func.search()"><i
                            class="layui-icon layui-icon-search"></i></button>
                </form>
            </div>
        </div>
        <div class="col-xs-12">
            <div id="table_parent_div" >
                <table id="table_div"  lay-filter="main"></table>
            </div>
        </div>
    </div>
</div>
</body>
<#include "../common/layui_init.html">
<!--表格工具类的按钮-->
<script type="text/html" id="toolbarBox">
    <div style="margin-bottom: -5px">
        <div class="layui-btn-container " style="float: left;">
            <button class="layui-btn " onclick="table_func.add()"><i class="layui-icon layui-icon-add-1"></i>添加</button>
            <button class="layui-btn  layui-btn-normal" onclick="table_func.edit()"><i
                    class="layui-icon layui-icon-edit"></i>编辑
            </button>
            <button class="layui-btn   layui-btn-danger" onclick="table_func.delete()"><i class="layui-icon layui-icon-delete"></i>删除
            </button>
            <button class="layui-btn   layui-btn-normal" onclick="table_func.set_role()"><i class="layui-icon"></i>设置用户角色
            </button>

        </div>
    </div>
</script>
<script type="text/javascript">
    //表头
    var cols = [[
        {field: 'id', title: 'id', sort: true, type: 'checkbox', fixed: 'left'}
        , {field: 'id', title: 'ID'}
        , {field: 'name', title: '姓名'}
        , {field: 'account', title: '账号'}
        , {field: 'password', title: '密码(已加密)'}
        , {field: 'sex', title: '性别'}
        , {field: 'email', title: '邮箱'}
        , {field: 'phone', title: '手机号'}
        , {field: 'role_info', title: '角色'}
        , {field: 'remark', title: '备注'}
        , {
            field: 'gmt_create', title: '创建时间'
            , templet: function (col) {
                return layui_table.date_format(col.gmt_create, "yyyy-MM-dd hh:mm:ss")
            }
        },
        {
            field: 'gmt_create', title: '修改时间'
            , templet: function (col) {
                return layui_table.date_format(col.gmt_modified, "yyyy-MM-dd hh:mm:ss")
            }
        }
    ]]
    //页面要用的方法
    table_func = {
        //表格初始化
        init: function () {
            //设置表格渲染的参数
            layui_table.set_table_data('${request.contextPath}/user/query', cols, "#toolbarBox");
            //进行表格渲染
            layui_table.table_render();
        },
        //搜索
        search: function () {
            layui_table.search(tool.paraArrayToLiteral($("#inquire").serializeArray()))
        },
        //添加
        add: function () {
            window.location.href = "${request.contextPath}/pages/user/add";
        },
        //编辑
        edit: function () {
            var id = layui_table.selectOne();
            if (id != null) {
                window.location.href = "${request.contextPath}/pages/user/add?id=" + id;
            }
        },
        //删除
        delete: function () {
            var id = layui_table.selectMany();
            if (id != null) {
                layui_layer.confirm("确定要删除吗?",function () {
                    $.post("${request.contextPath}/user/delete", {ids:tool.asString(id)}, function (o) {
                        if (o.code == 0) {
                            layer.msg(o.message);
                            table_func.search();
                        } else {
                            layui_layer.error_alert(o.message);
                        }
                    });
                })
            }
        },
        //设置角色
        set_role: function () {
            var id = layui_table.selectOne();
            if (id != null) {
                layer.open({
                    type:2,
                    title:"设置角色",
                    shadeClose: true,
                    shadeClose: true,
                    shade: 0.5,
                    area: ['90%', '90%'],
                    content: "${request.contextPath}/pages/role/module/set_role?userId="+id,
                    end : function(index, layero){
                        table_func.search();
                    }
                })
            }
        },
    }
    $(function () {
        //设置表格的属性值
        layui_table.lay_attr = $("#table_div").attr("lay-filter");
        //设置点击表格行,进行选中
        layui_table.click_line_checked();
        select2_utils.load_select2_key_id("role_id","请选择所属角色","/admin/role/getAll",{},"name",null,"id","不限角色")
        //渲染日期选择框
        layui_date.range_date_render("#gmt_create", "date", "#gmt_create_start", "#gmt_create_end");
        table_func.init();
    });
</script>
<#include "../common/footer-inner.html">
</html>
